<template>
  <div>
    <el-card class="search-card">
      <BasicForm
        ref="formData"
        formItemWidth="120px"
        :formColumns="formItemList"
        :dataSource="formData"
        :handleSearchForm="handleQueryForm"
        @getFormData="getFormData"
      />
    </el-card>
    <el-card class="table-card">
      <BasicTable
        showActionCol
        :showSelectCol="false"
        :loading="tableInfo.loading"
        :columns="tableInfo.columns"
        :dataSource="tableInfo.list"
        :pagination="pagination"
        :pageSizes="pageSizes"
        :tableHeight="480"
        :actionColWidth="120"
        :actionRender="renderTableBtnAction"
        @pageChange="handlePageChange"
        @pageSizeChange="handlePageSizeChange"
      />
    </el-card>
  </div>
</template>
<script>
import BasicForm from '@/components/BasicForm';
import BasicTable from '@/components/BasicTable';
import basePage from '@/mixins/commodity/basePage';
import { FORM_ITEMS, TABLE_COLUMNS } from './constants/toAudit';
import { getTableAction } from '@/utils/getBtnsRender';
import {
  getSearchParamBySearchType,
  getOAUrlToAction,
  getInitFormData
} from '@/utils/getUtils';
import { getAuditingListService } from '@/api/commodity/commodityManage/upOrDownManage';
export default {
  mixins: [basePage],
  components: {
    BasicForm,
    BasicTable,
  },
  data () {
    return {
      formItemList: FORM_ITEMS,
      formData: getInitFormData(FORM_ITEMS),
      tableInfo: {
        list: [],
        columns: TABLE_COLUMNS,
        loading: false
      },
      loadingFn: state => { this.tableInfo.loading = state }
    }
  },
  mounted () {
    this.getTableData();
  },
  methods: {
    // 渲染表格操作栏按钮
    renderTableBtnAction (h, { row }) {
      const actionList = [{ label: '查看', method: this.handleToView }];
      if (row.auditState === 'AUDITING') {
        actionList.push({ label: '审核', method: this.handleToAudit })
      }
      if (row.auditState !== 'AUDITING') {
        actionList.push({ label: '审批记录', method: this.handleToAuditRecord });
      }
      return getTableAction({ h, row, actionList, showBtn: this.showBtn });
    },
    // 查看
    handleToView (row) {
      const { href } = this.$router.resolve({
        name: 'publishOrUnderManageView',
        query: { recordNo: row.recordNo }
      });
      window.open(href, '_blank');
    },
    // 审核
    handleToAudit (row) {
      getOAUrlToAction(row.workflowRequestId, this.loadingFn);
    },
    // 审批记录
    handleToAuditRecord (row) {
      getOAUrlToAction(row.workflowRequestId, this.loadingFn);
    },
    // 获取表格数据
    async getTableData () {
      const searchParam = JSON.stringify(getSearchParamBySearchType(FORM_ITEMS, this.formData));
      const data = { searchParam, ...this.paginationParams };
      const retData = await getAuditingListService(data, this.loadingFn);
      if (retData) {
        this.tableInfo.list = retData.results;
        this.setTotalNum(retData.totalNum);
      }
    }
  }
}
</script>
